<template>
	<view v-if="date" class="Land_details">
		<!-- 轮播 -->
		<view class="Land_details_swiper">
			<swiper :indicator-dots="false" :autoplay="true" :interval="3000" :duration="1000" @change="onchane"
				v-if="video_url == ''">
				<swiper-item v-for="(item, index) in date.pic_list" :key="index">
					<view class="swiper-item">
						<image :src="item.pic_url" mode=""></image>
					</view>
				</swiper-item>
			</swiper>
			<video v-else :src="video_url" controls></video>
			<view class="swiper_msg" v-if="video_url == ''">{{ swiper_item_index + 1 }}/{{ date.pic_list.length }}
			</view>
			<view class="monitor_head" @click="get_play(date.device_id[0])">
				<image src="../static/images/land/monitor.png" mode=""></image>
				<text>监控</text>
			</view>
		</view>
		<!-- 价格 -->
		<view class="Land_details_top">
			<view class="Land_details_top_price">
				<view class="Land_details_price_head">
					<view class="Land_details_price">￥{{ date.min_price }}</view>
					<view>起</view>
				</view>
				<view class="">
					<view class="Land_details_top_sales">
						销量{{ date.sales }}{{ date.unit }}
					</view>
					<view class="Land_details_top_share" @click="shareGoods()">
						<image src="../static/images/land/share.png" mode=""></image>
						<view>分享</view>
					</view>
				</view>
			</view>
			<view class="Land_details_top_title">{{ date.name }}</view>
			<view class="Land_details_top_content">简介{{ date.desc }}</view>
			<!-- 	<view class="select_bottom_head">
				<view class="select_bottom_item">
					<view class="select_bottom_item_title">
						品种
					</view>
					<view class="select_bottom_item_content">
						家禽
					</view>
				</view>
				<view class="select_bottom_item">
					<view class="select_bottom_item_title">
						生长周期
					</view>
					<view class="select_bottom_item_content">
						一年(365天)
					</view>
				</view>
				<view class="select_bottom_items">
					<view class="select_bottom_item_title">
						剩余数量
					</view>
					<view class="select_bottom_item_content">
						55/100
					</view>
				</view>
			</view> -->
		</view>
		<!-- 认养信息 -->
		<view class="Land_item_head">
			<view class="Land_item_title_head">
				<view class="Land_item_title">认养信息</view>
				<!-- <view class="Land_item_msg">剩余7/12</view> -->
			</view>
			<view class="select_bottom_head">
				<view class="select_bottom_item">
					<image src="../static/images/land/time.png" mode=""></image>
					<view class="select_bottom_item_title"> 品种 </view>
					<view class="select_bottom_item_content">
						{{ date.varieties }}
					</view>
				</view>
				<view class="select_bottom_item">
					<image src="../static/images/land/cat.png" mode=""></image>
					<view class="select_bottom_item_title"> 生长周期 </view>
					<view class="select_bottom_item_content">
						{{ date.growth_cycle }}天
					</view>
				</view>
				<view class="select_bottom_items">
					<image src="../static/images/land/shouyi.png" mode=""></image>
					<view class="select_bottom_item_title"> 产量 </view>
					<view class="select_bottom_item_content">
						{{ date.yield }}/{{ date.unit }}
					</view>
				</view>
			</view>
		</view>
		<!-- 种子列表 -->
		<view class="seed_head">
			<view class="Land_item_title_head">
				<view class="Land_item_title">收益</view>
				<!-- <view class="Land_item_msg">查看全部<text>></text></view> -->
			</view>
			<view class="seed_list_head">
				<view class="seed_list_item" v-for="(item, index) in date.adopt_income" :key="index">
					<view class="seed_img">
						<image :src="item.pic" mode=""></image>
					</view>
					<view class="seed_info">
						{{ item.income_name }}
					</view>
				</view>
			</view>
		</view>
		<!-- 详情 -->
		<view class="detail_msg"> 详情 </view>
		<view class="detail_msgs">
			<rich-text :nodes="date.detail"></rich-text>
		</view>
		<!-- 没有更多了~ -->
		<view class="bottom_msg"> 没有更多了~ </view>
		<!-- 悬浮按钮 -->
		<view class="share_img" @click="shareGoods()">
			<image src="../static/images/land/shares.png" mode=""></image>
		</view>
		<view class="Topping_img" @click="get_pagescrollTo()">
			<image src="../static/images/land/zhiding.png" mode=""></image>
		</view>
		<!-- 底部购买 -->
		<view class="bottom_button_head">
			<view class="bottom_button_heads">
				<view class="button_msg_head">
					<view class="button_msg" @click="handleNavItem('/pages/home/home')">
						<image src="../static/images/land/index.png" mode=""></image>
						<view> 首页 </view>
					</view>

					<view class="button_msg">
						<image src="../static/images/land/kefu.png" mode=""></image>
						<view> 客服 </view>
						<button open-type="contact"></button>
					</view>
				</view>
				<view class="button_gm" @click="get_mode_type()"> 立即购买 </view>
			</view>
		</view>

		<!-- 购买弹窗 -->
		<view @touchmove.stop.prevent class="goods_mode" v-if="mode_type == true" @click="get_mode_type()"></view>

		<view class="goods_mode_info" v-if="mode_type == true">
			<view class="seed_item">
				<template v-if="attrData">
					<image :src="attrData.pic||date.cover_pic" mode="aspectFill"></image>
				</template>
				<!-- 无规格展示图片 -->
				<template v-else>
					<image v-if="goods_info.pic" :src="goods_info.pic" mode="aspectFill"></image>
					<image v-else :src="date.cover_pic" mode="aspectFill"></image>
				</template>
				<view class="item_info">
					<template v-if="attrData">
						<view class="item_price"> ￥{{ attrData.price }} </view>
						<view class="item_title"> 库存{{ attrData.num }}件 </view>
					</template>

					<template v-else>
						<view class="item_price" v-if="date.goods_price">
							￥{{ date.goods_price }}
						</view>
						<view class="item_price" v-else> ￥{{ date.min_price }} </view>
						<view class="item_title" v-if="date.num">
							库存{{ date.num }}件
						</view>
					</template>

					<view class="item_seed_content" v-if="attr_list.length">
						已选：<text v-for="(item, index) in attr_list">{{
              item.attr_name
            }}</text>
					</view>
				</view>
			</view>

			<scroll-view scroll-y="true" style="max-height: 40vh;padding:24rpx;">

				<view class="attr_info_head" v-for="(item, index) in attr_group_list" :key="index">
					<view class="attr_info_head_title">{{ item.attr_group_name }}</view>
					<view class="attr_info_heads">
						<view v-for="(it, ind) in item.attr_list" :key="ind"
							@click="get_add(item.attr_group_id, it.attr_id)" :class="[
				  'attr_info_item',
				  it.checked && 'attr_info_items',
				  it.attr_num_0 && 'attr_info_items_display',
				]">
							{{ it.attr_name }}
			  	</view>
					</view>
				</view>
			</scroll-view>
			
			<view class="item_msg">
				<view class="item_msg_title"> 认购数量 </view>
				<view class="item_num_head">
					<view class="item_num_icon" @click.stop="attr_num_jian()"> - </view>
					<view class="item_num">
						{{ attr_num }}
					</view>
					<view class="item_num_icon" @click.stop="attr_num_jia()"> + </view>
				</view>
			</view>
			<view class="goods_bottom_button">
				<view class="goods_bottom_buttons" @click="get_adopt_order()">
					确定
				</view>
			</view>
		</view>
		<!-- 分享 -->
		<goodsShare v-if="showGoodsShare" :topic_id="date.id" @closeShare="showGoodsShare = false"></goodsShare>
	</view>
</template>

<script>
	import Camera from '@/api/Camera/Camera.js';
	import adopt_detail from '@/api/livestockAdoption/adopt_detail.js';
	import goodsShare from './components/goodsShare.vue';
	export default {
		data() {
			return {
				mode_type: false,
				goods_id: '',
				date: '',
				swiper_item_index: 0,
				attr_list: [],
				arr: [],
				attr_group_list: [],
				attrData: '', //规格详细数据
				attr_num: 1,
				showGoodsShare: false,
				goods_info: {},
				video_url: '',
			};
		},
		components: {
			goodsShare,
		},
		onLoad(e) {
			this.goods_id = e.id;
			if (e?.scene) {
				let scene = decodeURIComponent(e.scene);
				let params = this.$utils.sceneDecode(scene);
				if (params.id) {
					this.goods_id = params.id;
				}
			}
		},
		onShow() {
			this.get_adopt_goods();
		},
		methods: {
			async get_play(device_id) {
				if (this.video_url == '') {
					try {
						var params = {
							device_id: device_id,
						};
						const res = await Camera.play(params);
						if (res.code == 0) {
							if (res.code == 0) {
								this.video_url = res.data.url;
							} else {
								uni.showToast({
									title: res.msg,
									icon: 'none',
								});
							}
						}
					} catch (e) {
					}
				} else {
					this.video_url = '';
				}
			},
			get_pagescrollTo() {
				uni.pageScrollTo({
					duration: 0,
					scrollTop: 0,
				});
			},
			// 点击nav
			handleNavItem(link) {
				// this.$utils.diySkip(link);
				uni.switchTab({
					url: link,
				});
			},
			// 点击分享
			shareGoods() {
				// this.$emit("shareGood");
				this.showGoodsShare = true;
			},
			attr_num_jia() {
				this.attr_num = this.attr_num + 1;
			},
			attr_num_jian() {
				if (this.attr_num == 1) {
					uni.showToast({
						title: '最少加购一个',
						icon: 'none',
					});
				} else {
					this.attr_num = this.attr_num - 1;
				}
			},
			inArray(val, arr) {
				return arr.some(function(v) {
					return val === v;
				});
			},
			// 选规格
			async get_add(i, i1) {
				let attr_group_list = JSON.parse(JSON.stringify(this.attr_group_list));
				let attrs = JSON.parse(this.date.attr);
				let attr_group_id = i || -1;
				let attr_id = parseInt(i1) || -1;
				let checkedAttr = [];
				let attr_list = [];

				// 点击选中及取消
				for (let i in attr_group_list) {
					if (attr_group_list[i].attr_group_id == attr_group_id) {
						// TODO 重新写个for循环是为了解决bug,如有更好方案再修改
						for (let j in attr_group_list[i].attr_list) {
							// 当前规格
							let attr = attr_group_list[i].attr_list[j];
							// 只有当前选中规格，和当前为真的取消选中。
							if (parseInt(attr.attr_id) === attr_id && attr.checked) {
								attr.checked = false;
							} else {
								attr.checked = parseInt(attr.attr_id) === attr_id;
							}
						}
					}
				}

				// 获取选中规格数据
				attr_group_list.forEach(group => {
					group.attr_list.forEach(attrOBJ => {
						if (attrOBJ.checked) {
							// 获取选中id
							checkedAttr.push(attrOBJ.attr_id);
							// 获取选中数据
							attr_list.push({
								attr_group_id: group.attr_group_id,
								attr_group_name: group.attr_group_name,
								attr_id: attrOBJ.attr_id,
								attr_name: attrOBJ.attr_name,
							});
						}
					});
				});

				for (let i in attr_group_list) {
					// 如果库存为0 则不往下执行
					for (let j in attr_group_list[i].attr_list) {
						let attr = attr_group_list[i].attr_list[j];
						if (attr.attr_id === attr_id && attr.attr_num_0) return;
					}
				}

				// 无库存规格样式 start
				let attrNum_0 = [];
				attrs.forEach(attr => {
					let arr = [];
					let sign = 0;
					attr.attr_list.forEach(attr_list_attr => {
						// 当前规格不在选中规格中
						if (!checkedAttr.some(cId => cId == attr_list_attr.attr_id)) {
							sign++;
						}
						arr.push(attr_list_attr.attr_id);
					});
					// 库存不足且不在选中规格组中
					if (attr.num <= 0 && sign <= 1) {
						attrNum_0.push(arr);
					}
				});
				let checkedAttrLength = checkedAttr.length;
				let attrGroupListLength = attr_group_list.length;
				let newAttrNum_0 = [];
				if (attrGroupListLength - checkedAttrLength <= 1) {
					for (let i in checkedAttr) {
						for (let j in attrNum_0) {
							if (this.inArray(checkedAttr[i], attrNum_0[j])) {
								for (let k in attrNum_0[j]) {
									if (attrNum_0[j][k] !== checkedAttr[i]) {
										newAttrNum_0.push(attrNum_0[j][k]);
									}
								}
							}
						}
					}
				}

				// 规格组只有一组 添加无库存标识
				attr_group_list.length == 1 &&
					attrs.forEach(attrData => {
						if (attrData.num <= 0) {
							attrData.attr_list[0] &&
								newAttrNum_0.push(attrData.attr_list[0].attr_id);
						}
					});

				//库存为0的规格添加标识
				for (let i in attr_group_list) {
					for (let j in attr_group_list[i].attr_list) {
						let cAttr = attr_group_list[i].attr_list[j];

						cAttr.attr_num_0 =
							this.inArray(cAttr.attr_id, newAttrNum_0) &&
							!this.inArray(cAttr.attr_id, checkedAttr);
					}
				}
				// 跟新group_list
				this.attr_group_list = attr_group_list;
				// 设置选中规格id
				this.attr_list = attr_list;

				// 获取规格信息
				this.getGoodsAttr();
			},
			// 获取选中规格信息
			async getGoodsAttr() {
				// 当前表示规格种类只有一种..  可根据规格信息判断库存.
				const attr_list = this.attr_list;
				const attr_group_list = this.attr_group_list;
				if (attr_list.length == attr_group_list.length) {
					// 获取选中规格数据
			
					const res = await this.$allrequest.goods.goodsAttrInfo({
						goods_id: this.goods_id,
						attr_list: this.attr_list.map(item => item.attr_id),
						number: this.attr_num,
					});
					this.attrData = res.data;
				}
			},
			//轮播触发
			onchane(e) {
				this.swiper_item_index = e.detail.current;
			},
			// 获取企业端首页数据
			async get_adopt_goods(id) {
				try {
					let formData = {
						id: this.goods_id,
					};
					const res = await adopt_detail.adopt_goods(formData);
				
					this.attr_group_list = res.data.attr_group_list;
					this.date = res.data;

					this.get_add();

					// 选中规格
				} catch (error) {
				}
			},
			get_mode_type() {
				this.mode_type = !this.mode_type;
			},
			// 跳转到订单页面
			get_adopt_order() {
				if (this.attr_list.length != this.attr_group_list.length && this)
					return uni.showToast({
						title: '请选择规格',
					});

				if (!this.attr_num)
					return uni.showToast({
						title: '请选择数量',
						mask: true,
					});

				var obj = {
					submit: [{
						mch_id: this.date.mch ? this.date.mch.id : 0,
						goods_list: [{
							goods_id: this.date.id,
							num: this.attr_num,
							attr: this.attr_list,
						}, ],
					}, ],
					attr_list: this.attr_list,
				};
				uni.navigateTo({
					url: '../adopt_order/adopt_order?obj=' + JSON.stringify(obj),
				});
			},
		},
	};
</script>

<style scoped>
	.monitor_head text {
		color: #ffffff;
		font-size: 22rpx;
	}

	.monitor_head image {
		width: 60rpx;
		height: 60rpx;
	}

	.monitor_head {
		width: 100rpx;
		height: 100rpx;
		background: rgb(0, 0, 0, 0.3);
		border-radius: 90rpx;
		position: absolute;
		top: 20rpx;
		right: 20rpx;
		display: flex;
		align-items: center;
		justify-content: center;
		flex-direction: column;
	}

	.attr_info_head {
		/* max-height: 50vh; */
		margin: 24rpx;
		margin-top: 0;
		overflow-y: auto;
	}

	.attr_info_heads {
		/* width: 90%; */
		margin: auto;
		display: flex;
		flex-wrap: wrap;
	}

	.attr_info_head_title {
		width: 100%;
		height: 80rpx;
		line-height: 80rpx;
		color: #000000;
	}

	.attr_info_item {
		padding: 10rpx 20rpx;
		background: #f2f1f2;
		color: #000000;
		border-radius: 25rpx;
		margin-right: 15rpx;
		margin-bottom: 15rpx;
	}

	.attr_info_items {
		background: #fbeceb;
		color: #ff191d;
	}

	.attr_info_items_display {
		text-decoration: line-through;
		color: #8c8c8c;
	}

	.Land_details_top_sales {
		font-size: 22rpx;
		font-weight: 400;
		color: #8c8c8c;
		/* padding-right: 4.8vw; */
		padding-bottom: 20rpx;
		margin-bottom: 0;
		display: flex;
		justify-content: flex-end;
	}

	.goods_bottom_buttons {
		width: 80%;
		height: 80rpx;
		background-image: linear-gradient(rgb(92, 186, 83), rgb(110, 215, 72));
		border-radius: 90rpx;
		color: #ffffff;
		text-align: center;
		line-height: 80rpx;
	}

	.goods_bottom_button {
		width: 100%;
		height: 100rpx;
		display: flex;
		align-items: center;
		justify-content: center;
		border-top: 1rpx solid #ebebeb;
		margin-top: 60rpx;
	}

	.item_msg_title {
		color: #000000;
	}

	.item_num {
		width: 70rpx;
		text-align: center;
		border-left: 1rpx solid #d3d3d3;
		border-right: 1rpx solid #d3d3d3;
	}

	.item_num_icon {
		width: 50rpx;
		height: 50rpx;
		text-align: center;
		line-height: 50rpx;
	}

	.item_num_head {
		border-radius: 10rpx;
		border: 1rpx solid #d3d3d3;
	}

	.item_price {
		color: rgb(240, 33, 10);
		font-weight: 600;
		font-size: 34rpx;
	}

	.item_num_head {
		display: flex;
		align-items: center;
		justify-content: space-between;
	}

	.item_msg {
		margin: 24rpx;
		margin-top: 0;
		padding-top: 46rpx;
		display: flex;
		align-items: center;
		justify-content: space-between;
	}

	.item_seed_content {
		color: #939393;
		font-size: 25rpx;
		padding: 20rpx 0;
	}

	.item_title {
		color: rgb(240, 33, 10);
		font-size: 25rpx;
	}

	.item_info {
		width: 75%;
		margin-left: 20rpx;
	}

	.seed_item image {
		width: 200rpx;
		height: 200rpx;
	}

	.seed_item {
		margin: 0 24rpx;
		display: flex;
	}

	.select_seed_head {
		width: 100%;
		background: #ffffff;
		padding: 20rpx 0;
		margin-top: 20rpx;
	}

	.goods_mode_info {
		position: fixed;
		left: 0;
		right: 0;
		bottom: 0;
		background: #ffffff;
		z-index: 99;
		border-top-left-radius: 25rpx;
		border-top-right-radius: 25rpx;
		padding: 20rpx 0;
		padding-bottom: env(safe-area-inset-bottom);
	}

	.goods_mode {
		position: fixed;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		background: rgb(0, 0, 0, 0.4);
		z-index: 9;
	}

	.select_bottom_items image {
		width: 50rpx;
		height: 50rpx;
	}

	.select_bottom_item image {
		width: 50rpx;
		height: 50rpx;
		padding-bottom: 10rpx;
	}

	.select_bottom_item_content {
		color: #868686;
		margin-top: 15rpx;
	}

	.select_bottom_item_title {
		color: #000000;
	}

	.select_bottom_items {
		width: 33.3%;
		display: flex;
		flex-direction: column;
		align-items: center;
	}

	.select_bottom_item {
		width: 33.3%;
		display: flex;
		flex-direction: column;
		align-items: center;
		border-right: 1rpx solid #e2e2e2;
	}

	.select_bottom_head {
		width: 100%;
		display: flex;
		align-items: center;
		justify-content: space-between;
		padding: 20rpx 0;
	}

	.button_gm {
		padding: 20rpx 120rpx;
		border-radius: 90rpx;
		color: #ffffff;
		background-image: linear-gradient(rgb(92, 186, 83), rgb(110, 215, 72));
	}

	.button_msg view {
		font-size: 20rpx;
		margin-top: 10rpx;
	}

	.button_msg image {
		width: 60rpx;
		height: 60rpx;
	}

	.button_msg button {
		position: absolute;
		width: 100%;
		height: 100%;
		opacity: 0;
	}

	.button_msg {
		width: 100rpx;
		height: 100rpx;
		display: flex;
		flex-direction: column;
		align-items: center;
		margin: 0 20rpx;
		position: relative;
	}

	.button_msg_head {
		display: flex;
		align-items: center;
	}

	.bottom_button_heads {
		width: 95%;
		height: 100%;
		display: flex;
		align-items: center;
		justify-content: space-between;
	}

	.bottom_button_head {
		width: 100%;
		height: 120rpx;
		position: fixed;
		bottom: 0;
		left: 0;
		background: #ffffff;
	}

	.bottom_msg {
		width: 100%;
		/* height: 100rpx; */
		text-align: center;
		line-height: 100rpx;
		color: #737373;
		background: #ffffff;
		padding-bottom: 100rpx;
	}

	.detail_msg {
		width: 100%;
		height: 100rpx;
		text-align: center;
		line-height: 100rpx;
		color: #737373;
		background: #ffffff;
	}

	.detail_msgs {
		width: 100%;
		/* height: 100rpx; */
		/* text-align: center; */
		/* line-height: 100rpx; */
		/* color: #737373; */
		background: #ffffff;
	}

	.Topping_img image {
		width: 30rpx;
		height: 30rpx;
	}

	.Topping_img {
		width: 60rpx;
		height: 60rpx;
		border-radius: 90rpx;
		position: fixed;
		bottom: 220rpx;
		right: 20rpx;
		background: #e6e6e6;
		display: flex;
		align-items: center;
		justify-content: center;
	}

	.share_img image {
		width: 30rpx;
		height: 30rpx;
	}

	.share_img {
		width: 60rpx;
		height: 60rpx;
		border-radius: 90rpx;
		position: fixed;
		bottom: 120rpx;
		right: 20rpx;
		background: #e6e6e6;
		display: flex;
		align-items: center;
		justify-content: center;
	}

	.seed_content {
		color: #8c8c8c;
		font-size: 22rpx;
	}

	.seed_title {
		color: #000000;
	}

	.seed_info {
		margin-left: 15rpx;
	}

	.seed_img image {
		width: 100%;
		height: 100%;
	}

	.seed_img {
		width: 50rpx;
		height: 50rpx;
	}

	.seed_list_item {
		width: 100%;
		margin-bottom: 30rpx;
		display: flex;
		align-items: center;
	}

	.seed_list_head {
		width: 90%;
		margin: 0 auto;
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
	}

	.seed_head {
		width: 100%;
		background: #ffffff;
		margin-top: 30rpx;
	}

	.cycle_head {
		width: 100%;
		background: #ffffff;
		margin-top: 30rpx;
	}

	.Land_selection_scoll_item_check image {
		width: 100%;
		height: 100%;
	}

	.Land_selection_scoll_item_check {
		width: 50rpx;
		height: 50rpx;
		margin-top: 40rpx;
	}

	.Land_selection_scoll_item_img image {
		width: 100%;
		height: 100%;
	}

	.Land_selection_scoll_item_img {
		width: 100rpx;
		height: 300rpx;
	}

	.Land_selection_scoll_item {
		width: 100rpx;
		display: flex;
		flex-direction: column;
		align-items: center;
		margin-right: 30rpx;
	}

	.uni-scroll-view-content {
		width: 100%;
		display: flex;
		align-items: center;
	}

	.Land_selection_scoll {
		width: 90%;
		margin: 0 auto;
		padding-bottom: 20rpx;
	}

	.Land_selection_title {
		color: #000000;
		margin-left: 20rpx;
	}

	.Land_selection_msg3 {
		width: 50rpx;
		height: 50rpx;
		border-radius: 10rpx;
		background: rgb(234, 234, 233);
	}

	.Land_selection_msg2 {
		width: 50rpx;
		height: 50rpx;
		border-radius: 10rpx;
		background: rgb(150, 115, 89);
	}

	.Land_selection_msg1 {
		width: 50rpx;
		height: 50rpx;
		border-radius: 10rpx;
		background: rgb(202, 184, 171);
	}

	.Land_selection_item {
		display: flex;
		align-items: center;
	}

	.Land_selection_head {
		width: 100%;
		height: 100rpx;
		display: flex;
		align-items: center;
		justify-content: space-around;
	}

	.Land_item_msg text {
		font-size: 24rpx;
		color: #000000;
	}

	.Land_item_msg {
		font-size: 24rpx;
		color: #aaaaaa;
	}

	.Land_item_title {
		color: #000000;
	}

	.Land_item_title_head {
		width: 90%;
		height: 100rpx;
		margin: 0 auto;
		display: flex;
		align-items: center;
		justify-content: space-between;
	}

	.Land_item_head {
		width: 100%;
		background: #ffffff;
		margin-top: 30rpx;
	}

	.Land_details_top_content {
		width: 90%;
		margin: 0 auto;
		color: #535353;
		font-size: 24rpx;
		padding: 20rpx 0;
	}

	.Land_details_top_title {
		color: #000000;
		width: 90%;
		margin: 0 auto;
	}

	.Land_details_top_share view {
		color: #000000;
		margin-left: 10rpx;
	}

	.Land_details_top_share image {
		width: 30rpx;
		height: 30rpx;
	}

	.Land_details_top_share {
		background: rgb(253, 241, 240);
		border-top-left-radius: 90rpx;
		border-bottom-left-radius: 90rpx;
		display: flex;
		align-items: center;
		justify-content: center;
		padding: 10rpx 20rpx;
	}

	.Land_details_price {
		font-size: 40rpx;
		font-weight: 600;
	}

	.Land_details_price_head {
		display: flex;
		align-items: flex-end;
		color: rgb(248, 38, 10);
		margin-left: 30rpx;
	}

	.Land_details_top_price {
		width: 100%;
		height: 120rpx;
		display: flex;
		align-items: center;
		justify-content: space-between;
	}

	.Land_details_top {
		width: 100%;
		background: #ffffff;
	}

	.swiper_msg {
		padding: 5rpx 10rpx;
		background: rgb(0, 0, 0, 0.3);
		border-radius: 45rpx;
		color: #ffffff;
		position: absolute;
		right: 20rpx;
		bottom: 20rpx;
		font-size: 24rpx;
	}

	.swiper-item image {
		width: 100%;
		height: 100%;
	}

	.swiper-item {
		width: 100%;
		height: 100%;
		position: relative;
	}

	swiper {
		width: 100%;
		height: 100%;
	}

	.Land_details_swiper video {
		width: 100%;
		height: 100%;
	}

	.Land_details_swiper {
		width: 100%;
		height: 600rpx;
		position: relative;
	}

	.Land_details {
		width: 100%;
		min-height: 100vh;
		background: #f1f1f1;
	}
</style>
